<template>
	<view>
		<o-navbarx :back="true" title="查看核销码" :isback="false" color="#000000"
			background="linear-gradient( 180deg, #DAF1E7 0%, #DAF1E720 28%, #DAF1E720 38%, #D4EBE120 50%, #CDE7DC20 62%, #D0E9DF20 76%, #DAF1E720 100%);">
		</o-navbarx>
		<view class="index_bg_top pad-lr-20 mar-top-20">
			<view class="bgfff radius-16 pad-tb-80 mar-top-40">
				<view class="display-ce align-items ">
					<image src="/static/img/icon_normal_zuojiantou.png" @click="currentval(1)" class="proudct-item-icon-25" mode="" v-show="pick_array.length>1&&current>0"></image>
					<image src="/static/img/icon_select_youjiantou.png" class="proudct-item-icon-25 re90" mode="" v-show="pick_array.length>1&&current==0"></image>
					<swiper :indicator-dots="false" :autoplay="false" :interval="3000" :duration="1000" :current="current"
						class="wid-hig-360" style="margin: 0 96rpx;">
						<swiper-item class="width-100 height-100" v-for="item in pick_array" :key="item.id">
							<view class="swiper-item width-100 height-100">
								<image :src="item.pick_img" class="width-100 height-100" mode=""></image>
							</view>
						</swiper-item>
					</swiper>
					<image src="/static/img/icon_select_youjiantou.png" @click="currentval(2)" class="proudct-item-icon-25" mode="" v-show="pick_array.length>1&&current<(pick_array.length-1)"></image>
					<image src="/static/img/icon_normal_zuojiantou.png" class="proudct-item-icon-25 re90" mode="" v-show="pick_array.length>1&&current==(pick_array.length-1)"></image>
				</view>
				<view class="mar-top-40 text-align-center fontSize-32">
					{{merchant_name}}
				</view>
			</view>
		<view class="mar-top-20 pad-lr-20 pad-tb-20 bgfff radius-16">
			<view class="display-sb align-items" @click="gomap">
				<view class="display align-items">
					<image src="/static/img/icon_dianpu.png" class="proudct-item-icon-24" mode=""></image>
					<view class="ml20 fontSize-30">{{merchant_val?.name}}</view>
					<image src="/static/img/icon_youjiantou_.png" class="ml10 wid-hig-28" mode=""></image>
				</view>
				<view class="display align-items">
					<image src="/static/img/icon_juli.png" class="proudct-item-icon-24" mode=""></image>
					<view class="ml10 fontSize-26 col-6">{{merchant_val?.distance}}km</view>
				</view>
			</view>
			<view class="mar-top-30 radius-16 bgfff display align-items" v-for="item in pick_array" :key="item.id">
				<image :src="item.img" class="proudct-item-icon-10 radius-16" mode=""></image>
				<view class="ml20">
					<view class="text-clamp-1 fontSize-28">{{item.name}}</view>
					<view class="display-sb align-items mar-top-20 fontSize-26 col-6">
						<text>{{item.attr_name}}</text><text>x{{item.number}}</text>
					</view>
					<view class="mar-top-22 fontSize-28 col-E23737"><text class="fontSize-20">￥</text>{{item.price}}</view>
				</view>
			</view>
		</view>
		</view>
	</view>
</template>

<script lang="ts" setup>
import { onLoad } from '@dcloudio/uni-app';
// import {pick_view} from '@/utils/api'
import { ref } from 'vue';
onLoad((options)=>{
		order_id.value = options.order_id
		_pick_view()
})
const current = ref(0)
const currentval = (e:number) =>{
	if(e==1){
		current.value--
	}else{
		current.value++
	}
}
const order_id = ref()//订单id
const pick_array = ref(),
	  merchant_name = ref(),
	  merchant_val = ref();
const _pick_view =() =>{
	pick_view({
		order_id:order_id.value,
		user_lat:uni.getStorageSync('lat'),
		user_lng:uni.getStorageSync('lng'),
	}).then(res=>{
		if(res.code==1){
			pick_array.value = res.data.pick_array
			merchant_name.value = res.data.merchant_name
			merchant_val.value = res.data.merchant_val
		}
	})
}
const gomap = () =>{
	uni.openLocation({
		latitude:Number(merchant_val.value.lat),
		longitude:Number(merchant_val.value.lng),
		address:merchant_val.value.merchant_full_address,
		name:merchant_val.value.name
	})
}
</script>

<style lang="scss">
	@import 'seecode.scss';
</style>